<!--  -->
<template>
  <div class="content w-full flex flex-wrap">
    <div
      class="creation-item img-item w-1/3"
      style="height: 300px"
      v-for="(item, index) in leaderImg"
      :key="index"
    >
      <img :src="item.url" alt="12" class="creation-img" />
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
const leaderImg = ref([
  { url: new URL('../../assets/img/viewImg/pic001.png', import.meta.url).href },
  { url: new URL('../../assets/img/viewImg/pic002.png', import.meta.url).href },
  { url: new URL('../../assets/img/viewImg/pic003.png', import.meta.url).href },
  { url: new URL('../../assets/img/viewImg/pic004.png', import.meta.url).href },
  { url: new URL('../../assets/img/viewImg/pic005.png', import.meta.url).href },
  { url: new URL('../../assets/img/viewImg/pic006.png', import.meta.url).href },
  { url: new URL('../../assets/img/viewImg/pic007.png', import.meta.url).href },
  { url: new URL('../../assets/img/viewImg/pic008.png', import.meta.url).href },
  { url: new URL('../../assets/img/viewImg/pic009.png', import.meta.url).href },
  { url: new URL('../../assets/img/viewImg/pic010.png', import.meta.url).href },
  { url: new URL('../../assets/img/viewImg/pic011.png', import.meta.url).href },
  { url: new URL('../../assets/img/viewImg/pic012.png', import.meta.url).href }
])
</script>
<style scoped lang="less">
/* @import url(); 引入css类 */
.creation-item {
  padding: 0.5rem;
  .creation-img {
    position: relative;
    height: 100%;
    width: 100%;
    object-fit: cover;
    border: 1px solid #383838;
    border-radius: 30px;
  }
}

</style>
